<template>
  <a-modal v-model:visible="_d.visible" title="隐私条款" width="50%">
    <div class="promise-content" v-html="_d.message"></div>
    <template #footer>
      <a-button v-if="_d.time.n > 0" class="btn" disabled>{{_d.time.n}}秒</a-button>
			<a-button v-else class="btn" type="primary" @click="handleOk()">确定</a-button>
    </template>
  </a-modal>
</template>

<script setup>
	import { reactive, ref, onMounted } from 'vue'
	import {notification} from "ant-design-vue";

	import {ApiPost, ApiGet} from "@/api/request.js";

	import {useRouter} from "vue-router";
	const router = useRouter();
	
	const _d = reactive({
		visible: false,
		message: '',
		
		time: {
			r: null,
			n: 0
		},
		yzm: '',
		params: {}
		
	})

	onMounted(() => {
		getData();
	})

	function open(yzm, params) {
		timeDown();
		_d.yzm = yzm;
		_d.params = params;
		_d.visible = true;
	}

	// 获取隐私条款
	function getData() {
		ApiGet("/Chat/getprivacypolicy").then(res => {
			let message = res.data;
			message = message.replace(/\r\n/g, '<br/>');
			message = message.replace(/\n/g, '<br/>');
			message = message.replace(/\s/g, '&nbsp;');
			_d.message = message;
		})
	}

	function handleOk() {
		ApiPost("/Web/register/"+_d.yzm, _d.params).then(res => {
			_d.visible = false;
			notification.success({
				message: '提示',
				description: '注册成功，请登录'
			});
			router.push({
				path: '/login'
			})
		})
	}

	function timeDown() {
		clearInterval(_d.time.r);
		_d.time.n = 5;
		_d.time.r = setInterval(() => {
			_d.time.n--;
			if(_d.time.n <= 0) {
				clearInterval(_d.time.r);
			}
		}, 1000);
	}

	defineExpose({
		open
	})

</script>

<style lang="less" scoped>
.promise-content {
	line-height: 26px;
}
.btn {
	width: 70px;
}
</style>